<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>随机产生20个整数</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <style>
        .container {
            margin: 20px;
        }
        textarea {
            width: 100%;
            height: 100px;
            margin-bottom: 10px;
        }
        button {
            border-radius: 10px;
            border: 2px solid;
            padding: 5px 8px;
            margin-right: 10px;
        }
    </style>
</head>
<body>
    <div class="container">
        <button id="generate">随机产生20个整数</button>
        <button id="findDivisible">找出能被5整除的整数</button>
        <button id="reset">重置</button>
        <br>
        <textarea id="numbers"></textarea>
        <textarea id="divisibleBy5"></textarea>
    </div>

    <script>
        $(document).ready(function() {
            function generateRandomNumbers() {
                let numbers = [];
                for (let i = 0; i < 20; i++) {
                    numbers.push(Math.floor(1000 + Math.random() * 9000)); // 生成4位随机整数
                }
                return numbers.sort((a, b) => a - b); // 从小到大排序
            }

            $('#generate').click(function() {
                const numbers = generateRandomNumbers();
                $('#numbers').val(numbers.join(', '));
            });

            $('#findDivisible').click(function() {
                const numbers = $('#numbers').val().split(', ').map(Number);
                const divisibleBy5 = numbers.filter(num => num % 5 === 0);
                $('#divisibleBy5').val(divisibleBy5.join(', '));
            });

            $('#reset').click(function() {
                $('#numbers').val('');
                $('#divisibleBy5').val('');
            });
        });
    </script>
</body>
</html>